<!doctype html>
<html>
	<head>
		<title>App Engine Demo</title>
		<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
	</head>
	<body>
		<div id="result">Loading...</div>

		<script>
			$(document).ready(function() {
				$.getJSON('/Equipment', function(data) {
					var content = "";

					for (var i = 0; i < data.length; i++) {
						var equip = data[i];
						
						content += equip.id + " - " + equip.name + "<br>";
						
						if (equip.brands) {
							content += "<ul>";
							 
							for (var j = 0; j < equip.brands.length; j++) {
								var brand = equip.brands[j];
								
								content += "<li>" + brand.id + " - " + brand.name + "</li>";
							}
							
							content += "</ul>";
						}
						else {
							content += "-----nenhuma marca cadastrada-----<br>";
						}
					}

					$('#result').html("Equipment List:<br>" + content);
				});
			});
		</script>
	</body>
</html>